<!DOCTYPE html>
<html lang="en">
<head>
    <title>{{title}}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="shortcut icon" href="{{ROOT}}/images/favicon.ico">
    <link rel="stylesheet" type="text/css" href="{{ROOT}}/css/bootstrap.css" />
    <link rel="stylesheet" type="text/css" href="{{ROOT}}/css/lhh_lib.css" />
    <link rel="stylesheet" type="text/css" href="{{ROOT}}/css/zh_tab.css" />
    <link rel="stylesheet" type="text/css" href="{{ROOT}}/css/bootstrap-datetimepicker.css" />
    <!-- HTML5 shim, for IE6-8 support of HTML5 elements. All other JS at the end of file. -->
    <!--[if lt IE 9]>
    <script type="text/javascript" src="{{ROOT}}/js/html5shiv.js"></script>
    <![endif]-->

</head>
<body class="content">
<div class="row _lhh_breadcrumb MB10 visible-lg">
    <ul class="breadcrumb pull-left">
        <li><a href="index.html">首页</a></li>
        <li class="active">组串电流分布曲线(共12条支路)</li>
    </ul>
    <div class="p-rel">
        <div class="_lhh_breadcrumb-more MR15">
            <!--电子时钟 begin-->
            <include file="{{ROOT}}/controllers/include/clock.html" dataType="html"></include>
            <!--电子时钟 end-->
        </div>
    </div>
</div>
<div class="row">
    <div class="col-mod-12">
        <div class="page-header">
            <div class="ML10 MT10">
                <label class="MR5">方阵</label>
                <select type="select" class="form-control">
                    <option>[01＃方阵]</option>
                    <option>[02＃方阵]</option>
                </select>
                <label class="MR5 ML30">逆变器</label>
                <select type="select" class="form-control">
                    <option>［01＃方阵］无锡上能逆变器01</option>
                    <option>[02＃方阵]无锡上能逆变器02</option>
                </select>
                <label class="MR5 ML30">汇流箱</label>
                <select type="select" class="form-control">
                    <option>[中船董工汇流箱0101]</option>
                </select>
                <label class="MR5 ML30">采集时间</label>
                <input size="16" type="text" value="2012-06-15 14:45" readonly class="form_datetime form-control">
                <button type="submit" class="btn page-header-btn ML30">查询</button>
            </div>
        </div>
    </div>
</div>
<div class="row MB30">
    <div class="col-md-12 MT20">
        <div class="echarts" style="height: 400px;width:100%;" id="echarts-column-chart"></div>
    </div>
</div>
</body>
</html>


<script type="text/javascript" src="{{ROOT}}/js/highstock.js"></script>
<script type="text/javascript" src="{{ROOT}}/js/bootstrap-datetimepicker.js"></script>
<script type="text/javascript" src="{{ROOT}}/js/datetimepicker-custom.js"></script>


<script type="text/javascript">
    LAMJS.main(function(){
        'use strict';
        var System=this;

        function highstock(){
            var seriesOptions = [],
                    seriesCounter = 0,
                    names = ['MSFT', 'AAPL'];
            $.each(names, function (i, name) {
                $('#echarts-column-chart').highcharts({
                    chart: {
                        height: 620,
                        zoomType: 'xy',
                        plotBackgroundColor:'#eef4ff'     //绘图区背景色
                    },
                    title: {
                        text: '2015年09月01日 组串电流分布曲线(共12条支路)',
                        x:40,
                        style:{
                            fontFamily:'SimHei'
                        }
                    },
                    xAxis: {
                        categories: ['06:00', '06:30','07:00', '07:30', '08:00','08:30', '09:00','09:30', '10:00','10:30','11:00','11:30','12:00', '12:30','13:00','13:30', '14:00','14:30','15:00','15:30','16:00','16:30','17:00','17:30','18:00','18:30','19:00','19:30','20:00'],
                        title:{
                            text:'时间',
                            y : -20,
                            x : -10
                        },
                        labels: {
                            rotation : -90,//旋转-90度
                            y : 50,
                            align: 'left'
                        },
                        gridLineWidth:1
                    },
                    plotOptions: {
                        series: {
                            marker: {
                                enabled: false, /*数据点是否显示*/
                                radius: 0       /*数据点大小*/
                            }
                        }
                    },
                    yAxis: [{
                        title: {
                            text: '电流(A)'
                        },
                        plotLines: [{
                            value: 0,
                            width: 1,
                            color: '#808080'
                        }]
                    }],
                    credits: {
                        enabled:false    //不显示版权标签
                    },
                    legend: {
                        enabled:false    //不显示图例
                    },
                    series: [{
                        name: '[01＃方阵]无锡上能逆变器01',
                        data: [0, 1,2.5,2.8,2.9,3.0,3.5,3.6,3.9,4.0,4.4,4.5,4.8,5.0,5,5,6,8,7.0,7.5,7.8,8.0,5.5,9.0,9,10,11,15]
                    }, {
                        name: '[02＃方阵]无锡上能逆变器02',
                        data: [1,2,3,4,4.8, 5.1, 5.5, 6.1, 8.6,9.0,9,6.5,6,8,7.0,7.5,7.8,8.0,10.0,10.2,10.3,9.0,8.0,7.2,7.5,10,12,14,15]
                    }, {
                        name: '[01＃方阵]',
                        data: [2,4,5,4.8, 5.1, 5.5, 6.1, 8.6,9.0,9,6.5,6,8,7.0,7.5,7.8,8.0,10.0,10.2,10.3,9.0,8.0,7.2,7.5,10,12,14,15]
                    }, {
                        name: '[02＃方阵]',
                        data: [1,2,3,4,4.8, 5.1, 5.5, 6.1, 8.6,9.0,9,6.5,6,8,10.3,9.0,8.0,7.2,7.5,10,12,14,7.0,7.5,7.8,8.0,10.0,10.2,,15]
                    },{
                        name: '[中船董工汇流箱0101]',
                        data: [1,2,3,4,4.8, 5.1, 5.5, 6.1,10.2,10.3,9.0,8.0,7.2,7.5,10,12,14,15,8.6,9.0,9,6.5,6,8,7.0,7.5,7.8,8.0,10.0]
                    }]

                });

            });

        }





        $(window).resize(function() {
            highstock();
        }).trigger('resize');

        function initDate(){
            $(".form_datetime").datetimepicker({format: 'yyyy-mm-dd hh:ii'});
        }



        $(function(){
            initDate();
        });



    });
</script>




